<template>
  <div>
    <el-container>
      <el-header>
        <el-menu :default-active="'1'" class="el-menu-demo" mode="horizontal"
                 @select="(key)=>{this.activeIndex = key}">
          <el-menu-item index="1">概览</el-menu-item>
          <el-menu-item index="2">规划</el-menu-item>
          <el-menu-item index="3">需求</el-menu-item>
          <el-menu-item index="4">发布</el-menu-item>
          <el-menu-item index="5">迭代</el-menu-item>
          <el-menu-item index="6">测试</el-menu-item>
          <el-menu-item index="7">文档附件</el-menu-item>
          <el-menu-item index="8">公告</el-menu-item>
          <el-menu-item index="9">项目成员管理</el-menu-item>
          <el-menu-item index="10">客户</el-menu-item>
        </el-menu>
      </el-header>
      <el-main>
        <overview v-if="activeIndex==='1'" :projectId="projectId"/>
        <plan v-if="activeIndex==='2'" :projectId="projectId"/>
        <requirement v-if="activeIndex==='3'" :projectId="projectId"/>
        <release v-if="activeIndex==='4'" :projectId="projectId"/>
        <spring v-if="activeIndex==='5'" :projectId="projectId"/>
        <user-assignment v-if="activeIndex==='9'" :projectId="projectId"></user-assignment>
        <user-project-attachment v-if="activeIndex==='7'" :projectId="projectId"></user-project-attachment>
        <user-project-announcement v-if="activeIndex==='8'" :projectId="projectId"></user-project-announcement>
        <test v-if="activeIndex==='6'" :projectId="projectId"></test>
        <customer v-if="activeIndex==='10'" :projectId="projectId"></customer>
      </el-main>
    </el-container>
  </div>
</template>
<script>
import Overview from "@/views/project/init/overview/index.vue";
import Plan from "@/views/project/init/plan/index.vue";
import Backlog from "@/views/project/init/backlog/index.vue";
import Work from "@/components/Project/workItem.vue";
import Need from "@/views/project/init/requirement/index.vue";
import Requirement from "@/views/project/init/requirement/index.vue";
import AddWork from "@/components/Project/addWork.vue";
import UserAssignment from "@/views/project/init/userAssignment/index.vue";
import UserProjectAttachment from "@/views/project/init/projectAttachment/index.vue";
import UserProjectAnnouncement from "@/views/project/init/projectAnnouncement/index.vue";
import Spring from "@/views/project/init/sprint/index.vue";
import Release from "@/views/project/init/release/index.vue";
import Test from "@/views/project/init/test/index.vue";
import Customer from "@/views/project/init/customer/index.vue";


export default {
  components: {
    Customer,
    Test,
    Requirement,
    Release,
    Spring,
    UserProjectAnnouncement,
    UserProjectAttachment, UserAssignment, AddWork, Plan, Overview, Backlog, Work, Need
  },
  data() {
    return {
      activeIndex: '1',
      projectId: 0
    };
  },
  watch: {
    $route(to, from) {
      this.projectId = Number(this.$route.query.projectId);
      console.log("项目id:", this.projectId);
    },
  },
  created() {
    this.projectId = Number(this.$route.query.projectId);
    console.log("项目id:", this.projectId);
  }
}
</script>
<style lang="scss" scoped>

</style>
